<template>
	<view class="My">
		<!-- 我的 -->
		<!-- 头部 -->
		<view class="head">
			<!-- 图片，用户名，简介 -->
			<view class="mix">
				<view class="user">
					<image :src="avatarUrl" mode="" style="border-radius: 10rpx;"></image>
					<view class="int">
						<text class="username">{{nickName}}</text>
						<!-- <text>简介：{{synopsis}}</text> -->
					</view>
					<!--箭头 -->
					<!-- <view class="top">
						<navigator url="">
							<image style="width: 20rpx;height: 43rpx;" src="https://obs-4a40.obs.cn-southwest-2.myhuaweicloud.com/shop/rightarrow.png" mode=""></image>
						</navigator>
					</view> -->
				</view>
			</view>
			<!-- 余额，优惠卷，收藏 -->
			<view class="hybrid">
				<view class="Mymoney">
					<navigator url="./Balance">
						<view class="num">
							<text class="nmoney">￥{{Number(money).toFixed(2)}}</text>
							<text class="ntext">我的余额</text>
						</view>
						
					</navigator>
				</view>
				<view class="Mycoupons">
					<navigator url="./Youhui">
						<view class="num">
							<text class="nmoney">{{couponCount}}</text>
							<text class="ntext">优惠券</text>
						</view>
						
					</navigator>
				</view>
				<view class="Mycollection">
					<navigator url="./Collect">
						<view class="num">
							<text class="nmoney">{{collectionCount}}</text>
							<text class="ntext">我的收藏</text>
						</view>
						
					</navigator>
				</view>
			</view>
		</view>
		<!-- 内容 -->
		<view class="Mainbody">
			<view class="same">
				<navigator url="./Order">
					<text>团购订单</text>
						<image style="width: 20rpx;height: 43rpx;" src="https://obs-4a40.obs.cn-southwest-2.myhuaweicloud.com/shop/rightarrow.png" mode=""></image>
				</navigator>
			</view>
			<view class="same">
				<navigator url="./Question">
					<text>常见问题</text>
						<image style="width: 20rpx;height: 43rpx;" src="https://obs-4a40.obs.cn-southwest-2.myhuaweicloud.com/shop/rightarrow.png" mode=""></image>
				</navigator>
			</view>
			<view class="same">
				<navigator url="./Service">
					<text>在线客服</text>
						<image style="width: 20rpx;height: 43rpx;" src="https://obs-4a40.obs.cn-southwest-2.myhuaweicloud.com/shop/rightarrow.png" mode=""></image>
				</navigator>
			</view>
			<view class="same">
				<navigator url="">
					<text>商家入驻</text>
						<image style="width: 20rpx;height: 43rpx;" src="https://obs-4a40.obs.cn-southwest-2.myhuaweicloud.com/shop/rightarrow.png" mode=""></image>
				</navigator>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				avatarUrl:'',
				avatar:'',
				nickName:'',
				synopsis:'',
				couponCount:'',
				collectionCount:'',
				money:''
			}
		},
		onShow(){
			this.avatarUrl=uni.getStorageSync('avatarUrl')
			this.nickName=uni.getStorageSync('nickName')
			this.getSetting();
			this.getcoll();
		},
		methods: {
			getcoll(){
				// 我的
				const requestCouon = {
					url: `/api/account/getMyData/1`,
					method: "get",
					callBack: (res) => {
						this.text = 'request success';
						this.avatar=uni.getStorageSync('avatarUrl')
						this.userName=uni.getStorageSync('nickName')
						this.synopsis=res.data.synopsis
						this.couponCount=JSON.stringify(res.data.couponCount)
						this.collectionCount=JSON.stringify(res.data.collectionCount)
						this.money=JSON.stringify(res.data.money)
					}
				}
				this.$http.request(requestCouon)
			},
			
			getSetting() {
				wx.getSetting({
					success(res) {
						if (!res.authSetting['scope.userInfo']) {
							uni.navigateTo({
								url: '/pages/auth/index'
							});
						} else {
							console.log(555)
						}
					}
				})
			},
			getAuth() {
				console.log(444)
				wx.getUserInfo({
					success: (res) => {
						console.log(res)
					}
				})
			},
			// go() {
			// 	// uni.navigateTo({
			// 	// 	url: "./Change"
			// 	// })
			// }
		}
	}
</script>

<style>
	.My {
		width: 100%;
		height: 100vh;
		background-color: #F1F1F1;
	}

	.My .head {
		/* width: 100%; */
		height: 270rpx;
		padding: 42rpx 40rpx 14rpx;
		background-color: #FFC300;
	}

	.My .head .mix .user {
		display: flex;
		flex-direction: row;
		position: relative;
	}

	.My .head .mix .user image {
		width: 150rpx;
		height: 150rpx;
		margin: 0 20rpx 20rpx 0;
	}

	.My .head .mix .user .int .username {
		font-size: 34rpx;
		color: #333333;
		margin: 20rpx 0 8rpx;
		font-weight: bolder;
		padding-bottom: 10rpx;
	}

	.My .head .mix .user .int {
		display: flex;
		flex-direction: row;
		flex-direction: column;
	}

	.My .head .mix .user .int text {
		color: #333333;
		font-size: 28rpx;
		font-weight: lighter;
	}

	.My .head .mix .user .top {
		position: absolute;
		bottom: 75rpx;
		right: -20rpx;
		color: #333333;
	}

	.hybrid {
		display: flex;
		justify-content: space-around;
		color: #333333;
	}

	.hybrid .num {
		display: flex;
		flex-direction: column;
		width: 144rpx;
		height: 82rpx;
		padding: 8rpx 30rpx 10rpx 26rpx;
		line-height: 48rpx;
		background-color: rgba(255,255,255,0.2);
		border-radius: 10rpx;
	}
	.hybrid .num .nmoney{
		font-size: 34rpx;
		margin: 0 auto;
		
	}

	.hybrid .num .ntext {
		font-size: 24rpx;
		margin: 0 auto;
	}

	.hybrid .num text {
		margin-left: 31rpx;
		font-size: 34rpx;
	}
	.Mainbody{
		padding: 20rpx 20rpx 0;
	}

	.same {
		width: 664rpx;
		height: 88rpx;
		line-height: 88rpx;
		padding: 0 26rpx 0 20rpx;
		background-color: #FFFFFF;
		margin-bottom: 20rpx;
		position: relative;
	}

	.same text {
		color: #000000;
		font-size: 34rpx;
		font-weight: bold;
	}

	.same image {
		position: absolute;
		right: 26rpx;
		top: 20rpx;
	}
</style>
